<template>
  <!-- 功能快捷入口 我的考勤  我的审批  我的日程 通知公告等无权限板块 -->
  <div id="otherMods">
    <div class="left">
      <!-- <notice></notice> -->
      <my-check></my-check>
    </div>
    <div class="right">
      <my-schedule></my-schedule>
    </div>
  </div>
</template>
<script>
import welcome from '../../components/otherMods/welcome.vue'
import entryList from '../../components/otherMods/entryList.vue'
import myCheck from '../../components/otherMods/myCheck.vue'
import notice from '../../components/otherMods/notice.vue'
import myAttendance from '../../components/otherMods/myAttendance.vue'
import mySchedule from '../../components/otherMods/mySchedule.vue'
export default {
  name: 'otherMods',
  data () {
    return {
      c_height: '100%'
    }
  },
  components: {
    welcome,
    entryList,
    myCheck,
    notice,
    myAttendance,
    mySchedule
  },
  mounted () {
    // let w_h = document.querySelector('.welcome').offsetHeight
    // this.c_height = 1000 - (1000 * 0.2) - 180 - 40
    // this.setHeight()

  },
  methods: {
    setHeight () {
      window.onresize = () => {
        return (() => {
          //窗口缩放自动获取元素宽高
          this.$nextTick(() => {
            let w_h = document.querySelector('.welcome').offsetHeight
            this.c_height = 1000 - (1000 * 0.2) - w_h - 40
            console.log(w_h)
          })
        }
        )()
      }
    }
  }
}
</script>
<style lang="scss" scoped>
#otherMods {
  display: flex;
  height: 550px;
  box-sizing: border-box;
  // padding-bottom: 20px;
  .left {
    width: 60%;
    margin-right: 10px;
    height: 100%;
  }
  .right {
    width: 40%;
    height: 100%;
  }
}
</style>